<template>
  <div class="app-container jsbos-flex-main practiceConfig">
    <el-tabs
      v-model="activeName"
      type="border-card"
      class="jsbos-el_tabs"
      v-loading="dataLoading"
    >
      <el-tab-pane label="答题题库配置" name="first">
        <configQuestions></configQuestions>
      </el-tab-pane>
      <el-tab-pane label="每日答题配置" name="second">
        <configDaily :dataForm="dataForm"></configDaily>
      </el-tab-pane>
      <el-tab-pane label="兴趣答题配置" name="third">
        <configInterest :dataForm="dataForm"></configInterest>
      </el-tab-pane>
      <el-tab-pane label="模拟/自主练习设置" name="fourth">
        <configSimulation :dataForm="dataForm"></configSimulation>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import { getConfigListByCategory } from "@/api/system/sysConfig";
import configQuestions from "@/views/exam/practice/config/questions/index.vue";
import configDaily from "@/views/exam/practice/config/configDaily.vue";
import configInterest from "@/views/exam/practice/config/configInterest.vue";
import configSimulation from "@/views/exam/practice/config/configSimulation.vue";
export default {
  name: "manage-practice-config",
  components: {
    configQuestions,
    configDaily,
    configInterest,
    configSimulation,
  },
  data() {
    return {
      dataLoading: false,
      activeName: "first",
      dataForm: {},
    };
  },
  watch: {
    activeName(val) {},
  },
  created() {
    this.initData();
  },
  methods: {
    initData() {
      this.dataLoading = true;
      this.$nextTick(() => {
        getConfigListByCategory("managePracticeConfig")
          .then((res) => {
            console.log("managePracticeConfig", res);
            if (res.data) {
              for (let i = 0; i < res.data.length; i++) {
                this.$set(
                  this.dataForm,
                  res.data[i].keyName,
                  res.data[i].keyValue
                    ? JSON.parse(res.data[i].keyValue)
                    : undefined
                );
              }
            }
            console.log("------", this.dataForm);
            // this.list = JSON.parse(res.data.keyValue);
            this.dataLoading = false;
          })
          .catch(() => {
            this.dataLoading = false;
          });
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.practiceConfig {
  padding: 0;
}
</style>
